<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  <!--<link href="/favicon.ico" type="image/x-icon" rel="shortcut icon">-->
  <link href="/semantic-ui/semantic.min.css" rel="stylesheet">
  <link href="/stylesheets/docs.css" rel="stylesheet">
  <title>Xuehu API Documentation</title>
  <style>[node-type=is-icp] { display: none }
    iframe { display: none !important }</style>
</head>
<body>
<header id="header" class="ui vertical segment zoomed">
  <div class="ui stackable very relaxed two column grid container">
    <a class="ui left teal massive corner label" title="Git仓库" target="_blank"
       href="https://coding.net/u/backflow/p/api-doc/git"><i class="github icon"></i></a>
    <div class="center aligned column">
      <h1 class="ui icon header">
        <img src="/images/icons/theming_reverse.png" class="ui icon image">Xuehu API Documentation
      </h1>
      <p>《学乎》平台的API/文档管理系统，通过<a href="/syntax" target="_blank">Markdown语法</a>您可以快速、方便的完成文档的设计与书写。</p>
    </div>
    <div class="left aligned column">
      <div class="ui dropdown button">
        <span class="text">选择API版本</span><i class="dropdown icon"></i>
        <div class="menu ui transition hidden" tabindex="-1">
          <div data-value="Default" class="item">1.0 版本</div>
          <div data-value="Bootstrap3" class="item">1.1 版本</div>
        </div>
      </div>

      <!--<a class="ui right floated animated fade violet basic button">-->
      <!--<div class="visible content">查看Git仓库</div>-->
      <!--<div class="hidden content"><i class="git icon"></i></div>-->
      <!--</a>-->

      <div class="ui divider"></div>
      <a href="/docs/new" class="ui positive animated fade labeled icon button"><i class="write icon"></i>新建文档</a>
    </div>
  </div>
</header>

<section id="docs" class="ui four cards vertical stackable doubling segment container">
  <% for (var i = 0, len = docs.length; i < len; i++) { var doc = docs[i] %>
  <div class="card">
    <div class="content">
      <div class="header"><%= doc.title %></div>
      <div class="meta">最后修改于: <%= doc.update_time %></div>
      <div class="description"><img src="/images/wireframe/paragraph.png" class="ui wireframe image"></div>
    </div>
    <div class="ui three bottom attached buttons">
      <a href="/docs/<%= doc._id %>" target="_blank" class="ui button">View</a>
      <a href="/docs/<%= doc._id %>/edit" class="ui positive button">Edit</a>
      <a data-doc="<%= doc._id %>" class="ui negative button">Delete</a>
    </div>
  </div>
  <% } %>
  <a class="card transition <%= docs.length == 0 ? '' : 'hidden' %>">
    <div class="content">
      <div class="header">Oooooops !</div>
      <div class="description">系统中没有发现任何文档...</div>
    </div>
    <button onclick="location='/docs/new'" class="ui bottom attached button"><i class="add icon"></i>新建文档</button>
  </a>
</section>

<div class="ui small basic modal centered transition">
  <div class="ui icon header"><i class="trash outline icon"></i>Delete warning</div>
  <div class="content"></div>
  <div class="actions">
    <div class="ui red cancel inverted button"><i class="remove icon"></i> No</div>
    <div class="ui green ok inverted button"><i class="checkmark icon"></i> Yes</div>
  </div>
</div>

<section class="ui vertical segment comments container">
  <div id="SOHUCS"></div>
</section>

<script src="/javascripts/jquery.min.js"></script>
<script src="/javascripts/angular.min.js"></script>
<script src="/semantic-ui/semantic.min.js"></script>
<script src="http://changyan.sohu.com/upload/changyan.js"></script>
<script>
  window._config = {showScore: true};
  window.changyan.api.config({
    appid: 'cysmsR4T6',
    conf: 'prod_2abc76b840f4b976871370adf4fda4d9'
  });

  var $header = $('#header');
  var $modal = $('.ui.basic.modal');
  var $docs = $('#docs');
  var onComplete = function () {
    $(this).remove();
    if ($docs.children('div.ui.card').length == 0) {
      $('a.ui.card').transition('scale')
    }
  };

  $('.ui.dropdown').dropdown();
  $('.negative.button').click(function () {
    var $this = $(this);
    var doc = $this.data('doc');
    $modal.children('.content').html('你确定要删除文档【' + doc + '】吗?');
    $modal.modal({
      closable: true,
      blurring: true,
      onDeny: function () {},
      onApprove: function () {
        $.ajax({method: 'DELETE', url: '/docs/' + doc}).done(function () {
          $this.closest('div.card').transition({animation: 'scale', onComplete: onComplete})
        })
      }
    }).modal('show');
    return false
  });

  function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  }

  function introduction() {
    var background = 'bg' + getRandomInt(1, 14);
    $header.addClass(background).removeClass('zoomed');
  }

  $(function () {
    introduction();
  })
</script>
</body>
</html>